<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8" >
        <meta name="viewport" content="width=device-width">
        <script src="https://unpkg.com/htmx.org@1.9.12" integrity="sha384-ujb1lZYygJmzgSwoxRggbCHcjc0rB2XoQrxeTUQyRjrOnlCoYta87iKBWq3EsdM2" crossorigin="anonymous"></script>
        
        <script type="text/javascript" src="/static/endpoint.js"></script>
    </head>
    <body id="body">
        <p>endpoint:</p>
        <p id="link">{{ link }}</p>
        <br>
        <p>method</p>
        <p id="method">{{ method }}</p>
        <br>
        <div id="path">
            <p>path_parametrs</p>
            {% for param in path_parametrs %}
                <input placeholder="{{ param }}" type="text" id="{{ param }}" name="{{ param }}">
            {% endfor %}
        </div>

        <div id="query">
            <p>query_parametrs</p>
            {% for param in query_parametrs %}
                <input placeholder="{{ param }}" type="text" id="{{ param }}" name="{{ param }}">
            {% endfor %}
        </div>

        <div id="post">
            <p>body_parametrs</p>
            {% for param in body_parametrs %}
                <input placeholder="{{ param }}" type="text" id="{{ param }}" name="{{ param }}">
            {% endfor %}
        </div>

        <button hx-on:click="make_request();">
            GO
        </button>

        <br>
        <br>
        <p>response:</p>
        <br>
        <code id="response">

        </code>

        
    </body>
</html> 
